<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>华猫商城</title>
		<style></style>
		<link href="../css/jquery.validator.css" rel="stylesheet">
		<link href="../css/common.css" rel="stylesheet">

		<link href="../plugin/userLib/css/user.css" rel="stylesheet">
		<link href="../plugin/userLib/css/userinfo.css" rel="stylesheet">
		<link href="../plugin/userLib/css/my_user.css" rel="stylesheet">
		<link href="../css/base.css" rel="stylesheet">
		<link href="../plugin/webuploader/webuploader.css" rel="stylesheet">
		<style>
			.n-default .n-left,
			.n-default .n-right {
				margin-top: 32px!important;
			}
			
			#specsAttrBox .webuploader-container {
				width: 80px;
				height: 20px;
				overflow: hidden;
			}
			
			.ZZHT-form tr {
				padding: 10px 0;
			}
			
			.ZZHT-form tr th {
				font-size: 14px;
			}
			
			.ZZHT-form tr td .ip_text {
				width: 352px;
			}
			
			.ZZHT-form tr td .ip_select {
				width: 362px;
			}
			
			.ZZHT-form tr td {
				font-size: 14px;
			}
			
			.ZZHT-form tr td img {
				margin-right: 15px;
				vertical-align: middle;
			}
			
			.ZZHT-form tr td .thumbnail {
				margin-top: 45px;
			}
			
			.img-reader {}
			
			.reader {
				margin-bottom: 5px;
			}
			
			.reader img {
				width: auto;
				height: 110px;
			}
		</style>
	</head>

	<body>
		<div id="header"></div>
		<div id="headerBox"></div>
		<!--<div id="nav_menu"></div>-->
		<div class="ZZHT-wrap">
			<div class="ZZHT-header" style="border-bottom: 1px solid #ffffff;">
				<div class="ZZHT-shop-nav">
					<div class="ZZHT-nav-box">
						<a href="#">
							<li class="liselect ZZHT-lfloat ZZHT-nav-boxa">商城商家</li>
						</a>
						<div class="ZZHT-clear"></div>
					</div>
				</div>
				<div class="ZZHT-clear"></div>
			</div>
			<div class="ZZHT-main">
				<div id="onLine_left"></div>
				<div class="ZZHT-content">

					<style>
						#specsAttrBox .webuploader-container {
							width: 80px;
							height: 20px;
							overflow: hidden;
						}
						
						.ZZHT-form tr {
							height: 150px;
							padding: 10px 0;
						}
						
						.ZZHT-form tr th {
							font-size: 14px;
						}
						
						.ZZHT-form tr td {
							font-size: 14px;
						}
						
						.ZZHT-form tr td img {
							margin-right: 15px;
							vertical-align: middle;
						}
						
						.ZZHT-form tr td a:hover {
							color: #fff;
						}
						
						.ZZHT-form tr td .thumbnail {
							margin-top: 45px;
						}
					</style>
					<div class="ZZHT-user-head clearfix"><span class="left fl">店铺信息</span><span class="right fr">当前位置：店铺信息--店铺设置</span></div>
					<div id="tab" class="ZZHT-tab-box">
						<div class="ZZHT-tab-content">
							<form id="editform" autocomplete="off">
								<div class="ZZHT-tab-item" style="position: relative;padding: 30px 0;">
									<table class="ZZHT-form">
										<tbody>
											<tr>
												<th width="150">banner一：</th>
												<td>
													<div class="upload clearfix">
														<div class="img-reader fl">
															<img class="banner1" src="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png" alt="" width="400" height="130">
														</div>
														<div class="thumbnail fl">
															<span class="upload-btn webuploader-container" id="adFilePicker1"><div class="webuploader-pick">上传</div><div id="rt_rt_1cd9oq0odom81pp31e3t1nrd199a1" style="position: absolute; top: -15px; left: 0px; width: 120px; height: 44px; overflow: hidden; bottom: auto; right: auto;"><input type="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="image/*"><label style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background: rgb(255, 255, 255);"></label></div></span>
															<input type="hidden" class="input-file bz upload-files ipt" id="shopImg1" value="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png">
															<span class="ZZHT-f999 fr" style="margin-left: 5px;font-size: 12px;">banner一参考尺寸：400*130</span>
														</div>
													</div>
												</td>
											</tr>
											<tr>
												<th width="150">banner二：</th>
												<td>
													<div class="upload clearfix">
														<div class="img-reader fl">
															<img class="banner2" src="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png" alt="" width="400" height="130">
														</div>
														<div class="thumbnail fl">
															<span class="upload-btn webuploader-container" id="adFilePicker2"><div class="webuploader-pick">上传</div><div id="rt_rt_1cd9oq0ok1n7p1r65smp110d1n7v4" style="position: absolute; top: -15px; left: 0px; width: 120px; height: 44px; overflow: hidden; bottom: auto; right: auto;"><input type="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="image/*"><label style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background: rgb(255, 255, 255);"></label></div></span>
															<input type="hidden" class="input-file bz upload-files ipt" id="shopImg2" value="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png">
															<span class="ZZHT-f999 fr" style="margin-left: 5px;font-size: 12px;">banner二参考尺寸：400*130</span>
														</div>
													</div>
												</td>
											</tr>
											<tr>
												<th width="150">banner三：</th>
												<td>
													<div class="upload clearfix">
														<div class="img-reader fl">
															<img class="banner3" src="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png" alt="" width="400" height="130">
														</div>
														<div class="thumbnail fl">
															<span class="upload-btn webuploader-container" id="adFilePicker3"><div class="webuploader-pick">上传</div><div id="rt_rt_1cd9oq0om1os91829jd8cgk1bo47" style="position: absolute; top: -15px; left: 0px; width: 120px; height: 44px; overflow: hidden; bottom: auto; right: auto;"><input type="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="image/*"><label style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background: rgb(255, 255, 255);"></label></div></span>
															<input type="hidden" class="input-file bz upload-files ipt" id="shopImg3" value="http://zzhtwl.oss-cn-qingdao.aliyuncs.com/sysconfigs/83c2fae348f511493d1545c4e88b6463.png">
															<span class="ZZHT-f999 fr" style="margin-left: 5px;font-size: 12px;">banner三参考尺寸：400*130</span>
														</div>
													</div>
												</td>
											</tr>
											<tr style="height: 100px !important;">
												<th width="150">&nbsp;</th>
												<td>
													<input class="fredBtn" type="button" value="保存" id="btn_save" onclick="save();">
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</form>
						</div>
					</div>

				</div>
			</div>
			<div style="clear:both;"></div>
			<br>
		</div>
		<div id="ck3"></div>
		<script src="../js/jquery.min.js"></script>
		<script src="../js/jquery.lazyload.min.js"></script>
		<script src="../js/jquery.validator.js"></script>
		<script src="../js/zh-CN.js"></script>
		<script src="../plugin/webuploader/webuploader.js"></script>
		<script src="../plugin/layer/layer.js"></script>
		<script src="../js/common.js"></script>
		<script src="../js/common_view.js"></script>
		<script type="text/javascript" src="../js/ljf_base.js"></script>
		<script>
			var shopId;
			$(function() {
				$.get(SURL + 'sktShops/findByUserId', {
					userId: localStorage.userId
				}, function(data, textStatus) { //获取店铺id
					shopId = data.entity[0].shopId;

					//先获取店铺信息渲染页面
					$.ajax({
						type: "get",
						url: SURL + "sktShops/findByXSShopsImg",
						data: {
							"shopId": shopId,
						},
						success: function(res) {
							console.log(res);
							if(res.entity[0]) {
								if(res.entity[0].shopImg1) {
									$('.banner1').attr('src', res.entity[0].shopImg1);
									$('#shopImg1').val(res.entity[0].shopImg1);
								}
								if(res.entity[0].shopImg2) {
									$('.banner2').attr('src', res.entity[0].shopImg2);
									$('#shopImg2').val(res.entity[0].shopImg2);
								}
								if(res.entity[0].shopImg3) {
									$('.banner3').attr('src', res.entity[0].shopImg3);
									$('#shopImg3').val(res.entity[0].shopImg3);
								}
							}

						}
					});

				});

				for(var i = 1; i < 4; i++) {
					ZZHT.upload({
						pick: '#adFilePicker' + i,
						formData: {
							dir: 'shops'
						},
						accept: {
							extensions: 'gif,jpg,jpeg,bmp,png',
							mimeTypes: 'image/*'
						},
						callback: function(f) {
							var json = f;
							var id = this.pick;
							//将上传的图片路径赋给全局变量
							$(id).next('input').val(json.entity);
							$(id).parent('div').prev('div').html('<img src="' + json.entity + '"  width="400" height="130"/>');
						}
					});
				}

			});
			
			//保存修改
			function save() {
				var ll = ZZHT.msg('数据处理中，请稍候...');
				var params = ZZHT.getParams('.ipt');
				params['shopId'] = shopId;
				console.log(params);
				$.post(SURL+'sktShops/updateByXSShopsImg', params, function(data) {
					layer.close(ll);
					var json = data;
					if(json.messageCode == '200') {
						ZZHT.msg(json.message, {
							icon: 1
						});
					} else {
						ZZHT.msg(json.message, {
							icon: 2
						});
					}
				});
			}
		</script>
	</body>

</html>